/* 我的考试 */
<template>
    <div>
        <div v-if="indexKey === 1">
            <el-card v-loading="loading" shadow="never" body-style="padding: 40px;">
                <el-tabs v-model="activeName">
                    <!-- <el-tab-pane :label="$t('myExams.myCourse')" name="first"></el-tab-pane> -->
                    <el-tab-pane :label="$t('myExams.myExam')" name="second">
                        <el-form v-if="this.global.currentUser.extend.isOverseas=='1'"
                        :model="queryForm"
                        label-width="130px"
                        
                        ref="addform"
                        label-suffix="："
                    >
                            <el-form-item :label="$t('题库分类')" prop="categoryName">
                                <el-select
                                    @change="changeQuestion"
                                    v-model="queryForm.categoryId"
                                    :placeholder="$t('common.pla.pleaseSelect')"
                                >
                                    <el-option
                                        v-for="item in options.questionPool"
                                        :key="item.id"
                                        :label="item.categoryName"
                                        :value="item.id"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-form>
                        <el-table :data="dataList" size="mini" stripe style="width: 100%">
                            <el-table-column :label="$t('myExams.nameExamination')" prop="examName"  show-overflow-tooltip></el-table-column>
                            <el-table-column :label="$t('myExams.examinationTime')" prop="examTime"></el-table-column>
                            <el-table-column :label="$t('myExams.examinationResults')" prop="result" min-width="120" align="center">
                                <template slot-scope="scope">
                                    <el-tag v-if="scope.row.result==0" type="info">{{$t('myExams.notAttend')}}</el-tag>
                                    <el-tag v-if="scope.row.result==1" type="success">{{$t('myExams.pass')}}</el-tag>
                                    <el-tag v-if="scope.row.result==2" type="danger">{{$t('myExams.noPass')}}</el-tag>
                                </template>
                            </el-table-column>
                            <el-table-column :label="$t('myExams.operation')">
                                <template slot-scope="scope">
                                    <el-button type="text" v-if="scope.row.result!=0" @click="check(scope.row)">{{ $t('myExams.check') }}</el-button>  <!-- 查看 -->
                                    <el-button type="text" v-if="scope.row.result==0" @click="startExam(scope.row)">{{ $t('myExams.startExam') }}</el-button> <!-- 开始考试 -->
                                    <el-button type="text" v-if="scope.row.result==2" @click="reExamination(scope.row)">{{ $t('myExams.reExamination') }}</el-button> <!-- 重新考试 -->
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-tab-pane>
                </el-tabs>
            </el-card>
        </div>
        <!-- 开始考试 -->
        <div v-if="indexKey === 2">
            <examinationStart
                :compile="compile"
                :dataList="dataListObj"
                :dataObj="dataObj"
                @change-exam="changeExam">
            </examinationStart>
        </div>
        <!-- 我的考试(查看部分) -->
        <div v-if="indexKey === 3">
            <examinationCheck
                :compile="compile"
                :dataList="dataObjList"
                :dataObj="dataObj"
                @change-exam="changeExam">
            </examinationCheck>
        </div>
    </div>
</template>

<script>
import { queryDic } from 'common/src/api/dictionary'
import store from 'common/src/store';
import UTILS from 'common/src/utils/utils'
import {setLanguage} from "common/src/api/session"
import myExaminationsApi from 'common/src/api/academicBehaviorNorms/myExaminations/myExaminations';
import examinationManagementApi from 'common/src/api/academicBehaviorNorms/examination/examinationManagement';
import examStart from './examinationAdd'
import examCheck from './examinCheck'
import mixin from 'common/src/mixins/index';
export default {
    components: {
        examinationStart: examStart,
        examinationCheck: examCheck
    },
    mixins: [mixin],
    inject: ['reload'],
    data() {
        return {
            activeName: 'second',
            dataList: [
               
            ],
            indexKey: 1,
            compile: '',
            queryForm: {
                studentId: '',
                categoryId: ''
            },
            options: {
                questionPool: []
            },
            dataObj: {},
            dataObjList: {},
            dataListObj: []
        }
    },
    mounted() {
        // if (this.global.currentUser.extend.isOverseas=='1') {
        //     setLanguage({
        //         language: 'en'
        //     }).then(res => {
        //         if (res.code === 200) {
        //             this.$i18n.locale = 'en';// 给前端使用
        //             this.$store.dispatch("setLanguage", 'en');// 给后端使用
        //             // this.$message({
        //             //     message: "switch language success",
        //             //     type: "success"
        //             // });
        //             // this.reload();
        //         // } else{
        //         //     this.$message({
        //         //         message: res.msg,
        //         //         type: "error"
        //         //     });
        //         }

        //     })
        // }
        examinationManagementApi.listCategory().then(res => {
            console.log(res, 'dfd');
            if (res.data.length>0) {
                res.data.forEach(el => {
                    if (el.categoryName =='中文') {
                        this.queryForm.categoryId = el.id
                    }
                })
            }
            //  
            this.options.questionPool = res.data
        }).then(() => {

            this.queryForm.studentId = this.global.currentUser.uid
            this.getMyExaminationsApi(this.queryForm)
        })
        // this.getListCategory()
    },
    methods: {
        changeQuestion(id) {
            if (id) {
                myExaminationsApi.getExamList(this.queryForm).then(res => {
                    if (res && res.code == 200) {
                        this.dataList = res.data
                    }
                })
            }
        },
        getListCategory() {
            examinationManagementApi.listCategory().then(res => {
                console.log(res, 'dfd');
                //  queryForm.categoryId: ''
                this.options.questionPool = res.data
            })
        },
        getMyExaminationsApi(obj) {
            myExaminationsApi.getExamList(obj).then(res => {
                this.dataList = res.data
            })
        },
        // 查看
        check(data) {
            let obj = {
                studentId: this.queryForm.studentId,   // this.global.user.uid
                examId: data.examId,
                id: data.id
            }
            myExaminationsApi.queryExamRecord(obj).then(res => {
                this.dataObjList = res.data
                this.dataObj = obj
                this.compile = ''
                this.indexKey = 3
            })
        },
        // 开始考试
        startExam(data) {
            let obj = {
                studentId: this.queryForm.studentId,   // this.global.user.uid
                examId: data.examId
            }
            myExaminationsApi.postStartExam(obj).then(res => {
                this.dataListObj = res.data
                this.dataObj = data
                this.$confirm(this.$t('myExams.exam')+data.questionNum+this.$t('myExams.examination'), this.$t('myExams.warmPromp'), {
                    confirmButtonText: this.$t('myExams.confirm'),
                    cancelButtonText: this.$t('myExams.cancel'),
                    type: 'info'
                }).then(() => {
                    this.compile = ''
                    this.indexKey = 2 
                }).catch(() => {
    
                });
            })
        },
        // 重新考试
        reExamination(data){
          let obj = {
                studentId: this.queryForm.studentId,   // this.global.user.uid
                examId: data.examId
            }
            myExaminationsApi.postStartExam(obj).then(res => {
                this.dataListObj = res.data
                this.dataObj = data
                this.$confirm(this.$t('myExams.exam')+data.questionNum+this.$t('myExams.examination'), this.$t('myExams.warmPromp'), {
                    confirmButtonText: this.$t('myExams.confirm'),
                    cancelButtonText: this.$t('myExams.cancel'),
                    type: 'info'
                }).then(() => {
                    this.compile = ''
                    this.indexKey = 2 
                }).catch(() => {
    
                });
            })
        },
        // reExamination(data) {
        //     let obj = {
        //         studentId: this.queryForm.studentId,   // this.global.user.uid
        //         examId: data.examId,
        //         id: data.id
        //     }
        //     myExaminationsApi.startExam(obj).then(res => {
        //         this.dataListObj = res.data
        //         this.dataObj = data
        //         this.$confirm(this.$t('myExams.exam')+data.questionNum+this.$t('myExams.examination'), this.$t('myExams.warmPromp'), {
        //             confirmButtonText: this.$t('myExams.confirm'),
        //             cancelButtonText: this.$t('myExams.cancel'),
        //             type: 'info'
        //         }).then(() => {
        //             this.compile = ''
        //             this.indexKey = 2 
        //         }).catch(() => {
    
        //         });
        //     })
        // },
        // 返回列表主页
        changeExam() {
            this.indexKey = 1
            this.queryForm.studentId = this.global.currentUser.uid
            this.getMyExaminationsApi(this.queryForm)
        },
    },
}
</script>
<style scoped>
#tab-first{
    font-size: 20px
}
#tab-second{
    font-size: 20px
}
.el-tabs__content{
    margin-top: 30px
}
</style>